import React, { useEffect } from 'react';
import './index.scss';

interface itemType {
  link?:string | Function,  // url
  name:string // 名称
}

interface defaultProps {
    list:itemType[],
    history:any, // 路由跳转对象
    pathname:string // 路径名称
}


const NavBar = (props: defaultProps) => {
    const { list,history } = props;

    useEffect(() => {
    }, []);

    const jumpPage = (link: any) => {
        if (link == '' || link == undefined) {
            return;
        }
        if (typeof link == 'string') {
            history.replace(link)
        } else {
            link()
        }
    }
    return (
        <div className="path_title">
            <div>您当前所在位置：</div>
            {
                list.map((val: any, index: string | number) => {
                    return (
                        val.name && <div key={index}>
                            {index > 0 && <b>&gt;</b>}
                            <div onClick={() => { jumpPage(val.link) }}>{val.name}</div>
                        </div>
                    )
                })
            }
        </div>
    );
};

export default NavBar;
